<template>
	<view>
		<template v-if="JSON.stringify(GeRen_ZiLiao) != '{}'">
			<view class="TouXiang" @click="DianJi_TouXiang_ShangChuan">
				<view>
					<image :src="GeRen_ZiLiao.avatar" mode="widthFix"></image>
				</view>
				<text class="iconfont icon-xiangji1"></text>
			</view>
			<view
				@click="DianJi_AnNiu_YongHuTiaoFu"
				class="YongHu-HengFu">
				<template v-if="GeRen_ZiLiao.banner">
					<image :src="GeRen_ZiLiao.banner" mode="widthFix"></image>
				</template>
				<template v-else>
					<text>暂无用户横幅</text>
				</template>
			</view>
			<view class="ZiDingYi-DanHang-Input">
				<view class="Zuo">用户 Uid</view>
				<input type="text" disabled="true" v-model="Vmodel_YongHuUid">
			</view>
			<view class="ZiDingYi-DanHang-Input">
				<view class="Zuo">昵称</view>
				<input type="text" v-model="Vmodel_YongHuNiCheng">
				<view class="You">
					<view class="AnNiu" @click="DianJi_AnNiu('YongHuNiCheng')">修改</view>
				</view>
			</view>
			<view class="ZiDingYi-DanHang-Input">
				<view class="Zuo">用户名</view>
				<input type="text" v-model="Vmodel_YongHuMing">
				<view class="You">
					<view class="AnNiu" @click="DianJi_AnNiu('YongHuMing')">修改</view>
				</view>
			</view>
			<view class="ZiDingYi-DanHang-Input">
				<view class="Zuo">性别</view>
				<input type="number" v-model="Vmodel_XingBie">
				<view class="You">
					<view class="AnNiu" @click="DianJi_AnNiu('XingBie')">修改</view>
				</view>
			</view>
			<view style="font-size: 22rpx;color: #C0C4CC;margin: 10rpx 0 0 25rpx;line-height: 22rpx;">1.保密 2.男 3.女</view>
			<view class="ZiDingYi-DanHang-Input">
				<view class="Zuo">生日</view>
				<input type="text" v-model="Vmodel_ShengRi">
				<view class="You">
					<view class="AnNiu" @click="DianJi_AnNiu('ShengRi')">修改</view>
				</view>
			</view>
			<view style="font-size: 22rpx;color: #C0C4CC;margin: 10rpx 0 0 25rpx;line-height: 22rpx;">格式：2023-01-01 00:00:00 或 2023-01-01</view>
			<view class="ZiDingYi-DanHang-Input">
				<view class="Zuo">简介</view>
				<input type="text" maxlength="-1" v-model="Vmodel_JianJie">
				<view class="You">
					<view class="AnNiu" @click="DianJi_AnNiu('JianJie')">修改</view>
				</view>
			</view>
			<view style="font-size: 22rpx;color: #C0C4CC;margin: 10rpx 0 0 25rpx;line-height: 22rpx;">不持HTML格式</view>
			<!-- <view class="ZiDingYi-DanHang-Input">
				<view class="Zuo">位置</view>
				<input type="text" maxlength="-1" v-model="Vmodel_WeiZhi">
				<view class="You">
					<view class="AnNiu" @click="DianJi_AnNiu('WeiZhi')">修改</view>
				</view>
			</view> -->
			<view class="ZiDingYi-DanHang-Input">
				<view class="Zuo">对话设置</view>
				<input type="number" v-model="Vmodel_DuiHua">
				<view class="You">
					<view class="AnNiu" @click="DianJi_AnNiu('DuiHua')">修改</view>
				</view>
			</view>
			<view style="font-size: 22rpx;color: #C0C4CC;margin: 10rpx 0 0 25rpx;line-height: 22rpx;">1.允许所有 2.仅允许我关注的 3.我关注的和已认证的 4.不允许所有</view>
			<view class="ZiDingYi-DanHang-Input">
				<view class="Zuo">评论设置</view>
				<input type="number" v-model="Vmodel_PingLun">
				<view class="You">
					<view class="AnNiu" @click="DianJi_AnNiu('PingLun')">修改</view>
				</view>
			</view>
			<view style="font-size: 22rpx;color: #C0C4CC;margin: 10rpx 0 0 25rpx;line-height: 22rpx;">1.允许所有 2.仅允许我关注的 3.我关注的和已认证的 4.不允许所有</view>
		</template>
		<template v-else>
			<view class="YR-UI-JiaZaiZhong-1">
				<view></view>
			</view>
		</template>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				GeRen_ZiLiao:{},
				Vmodel_YongHuUid:"",
				Vmodel_YongHuNiCheng:"",
				Vmodel_YongHuMing:"",
				Vmodel_XingBie:"",
				Vmodel_ShengRi:"",
				Vmodel_JianJie:"",
				Vmodel_WeiZhi:"",
				Vmodel_DuiHua:"",
				Vmodel_PingLun:""
			}
		},
		onLoad() {
			this.QingQiu_YongHuZiLiao()
		},
		methods: {
			QingQiu_YongHuZiLiao(){
				uni.request({
					url:this.$_URL() + "/api/v2/user/"+uni.getStorageSync('YongHuXinXi').data.detail.username+"/detail",
					method:'GET',
					header:this.$_Fresns_Header(),
					success: (res) => {
						this.GeRen_ZiLiao = res.data.data.detail;
						this.Vmodel_YongHuUid = res.data.data.detail.uid;
						this.Vmodel_YongHuNiCheng = res.data.data.detail.nickname;
						this.Vmodel_YongHuMing = res.data.data.detail.username;
						this.Vmodel_XingBie = res.data.data.detail.gender;
						this.Vmodel_ShengRi = res.data.data.detail.birthday;
						this.Vmodel_JianJie = res.data.data.detail.bio;
						this.Vmodel_WeiZhi = res.data.data.detail.location;
						this.Vmodel_DuiHua = res.data.data.detail.conversationLimit;
						this.Vmodel_PingLun = res.data.data.detail.commentLimit;
					}
				})
			},
			
			DianJi_AnNiu(e){
				uni.showLoading();
				if(e == 'YongHuNiCheng'){
					uni.request({
						url:this.$_URL() + "/api/v2/user/edit",
						method:'PUT',
						header:this.$_Fresns_Header(),
						data:{
							"nickname":this.Vmodel_YongHuNiCheng
						},
						success: (res) => {
							uni.hideLoading();
							if(res.data.code == 0){
								uni.setStorage({
									key: 'LinShiChuCun',
									data:"",
									success: (res__) => {
										uni.navigateBack()
									}
								});
							}else{
								uni.showToast({
									title:res.data.message,
									icon:"none",
									duration:1000
								});
							}
						}
					})
				}
				if(e == 'YongHuMing'){
					uni.request({
						url:this.$_URL() + "/api/v2/user/edit",
						method:'PUT',
						header:this.$_Fresns_Header(),
						data:{
							"username":this.Vmodel_YongHuMing
						},
						success: (res) => {
							uni.hideLoading();
							if(res.data.code == 0){
								uni.setStorage({
									key: 'LinShiChuCun',
									data:"",
									success: (res__) => {
										uni.navigateBack()
									}
								});
							}else{
								uni.showToast({
									title:res.data.message,
									icon:"none",
									duration:1000
								});
							}
						}
					})
				}
				if(e == 'XingBie'){
					uni.request({
						url:this.$_URL() + "/api/v2/user/edit",
						method:'PUT',
						header:this.$_Fresns_Header(),
						data:{
							"gender":this.Vmodel_XingBie
						},
						success: (res) => {
							uni.hideLoading();
							if(res.data.code == 0){
								uni.setStorage({
									key: 'LinShiChuCun',
									data:"",
									success: (res__) => {
										uni.navigateBack()
									}
								});
							}else{
								uni.showToast({
									title:res.data.message,
									icon:"none",
									duration:1000
								});
							}
						}
					})
				}
				if(e == 'ShengRi'){
					uni.request({
						url:this.$_URL() + "/api/v2/user/edit",
						method:'PUT',
						header:this.$_Fresns_Header(),
						data:{
							"birthday":this.Vmodel_ShengRi
						},
						success: (res) => {
							uni.hideLoading();
							if(res.data.code == 0){
								uni.setStorage({
									key: 'LinShiChuCun',
									data:"",
									success: (res__) => {
										uni.navigateBack()
									}
								});
							}else{
								uni.showToast({
									title:res.data.message,
									icon:"none",
									duration:1000
								});
							}
						}
					})
				}
				if(e == 'JianJie'){
					uni.request({
						url:this.$_URL() + "/api/v2/user/edit",
						method:'PUT',
						header:this.$_Fresns_Header(),
						data:{
							"bio":this.Vmodel_JianJie
						},
						success: (res) => {
							uni.hideLoading();
							if(res.data.code == 0){
								uni.setStorage({
									key: 'LinShiChuCun',
									data:"",
									success: (res__) => {
										uni.navigateBack()
									}
								});
							}else{
								uni.showToast({
									title:res.data.message,
									icon:"none",
									duration:1000
								});
							}
						}
					})
				}
				if(e == 'WeiZhi'){
					uni.request({
						url:this.$_URL() + "/api/v2/user/edit",
						method:'PUT',
						header:this.$_Fresns_Header(),
						data:{
							"bio":this.Vmodel_WeiZhi
						},
						success: (res) => {
							uni.hideLoading();
							if(res.data.code == 0){
								uni.setStorage({
									key: 'LinShiChuCun',
									data:"",
									success: (res__) => {
										uni.navigateBack()
									}
								});
							}else{
								uni.showToast({
									title:res.data.message,
									icon:"none",
									duration:1000
								});
							}
						}
					})
				}
				if(e == 'DuiHua'){
					uni.request({
						url:this.$_URL() + "/api/v2/user/edit",
						method:'PUT',
						header:this.$_Fresns_Header(),
						data:{
							"conversationLimit":this.Vmodel_DuiHua
						},
						success: (res) => {
							uni.hideLoading();
							if(res.data.code == 0){
								uni.setStorage({
									key: 'LinShiChuCun',
									data:"",
									success: (res__) => {
										uni.navigateBack()
									}
								});
							}else{
								uni.showToast({
									title:res.data.message,
									icon:"none",
									duration:1000
								});
							}
						}
					})
				}
				if(e == 'PingLun'){
					uni.request({
						url:this.$_URL() + "/api/v2/user/edit",
						method:'PUT',
						header:this.$_Fresns_Header(),
						data:{
							"commentLimit":this.Vmodel_PingLun
						},
						success: (res) => {
							uni.hideLoading();
							if(res.data.code == 0){
								uni.setStorage({
									key: 'LinShiChuCun',
									data:"",
									success: (res__) => {
										uni.navigateBack()
									}
								});
							}else{
								uni.showToast({
									title:res.data.message,
									icon:"none",
									duration:1000
								});
							}
						}
					})
				}
			},
			// 点击，头像
			DianJi_TouXiang_ShangChuan(){
				uni.chooseImage({
					count:1,
					success: (res_) => {
						this.DianJi_TouXiang_ShangChuan_FangFa(res_.tempFiles)
					}
				})
			},
			DianJi_TouXiang_ShangChuan_FangFa(e){
				uni.showLoading({ title: "上传中" });
				uni.uploadFile({
					url: this.$_URL() + "/api/v2/common/upload-file",
					filePath: e[0].path,
					name: "file",
					header: this.$_Fresns_Header(),
					formData:{
						"tableName":"users",
						"tableColumn":"avatar_file_id",
						"tableKey":this.GeRen_ZiLiao.username,
						"type":"image",
						"uploadMode":"file"
					},
					success: (res) => {
						if(JSON.parse(res.data).code == 0){
							uni.request({
								url:this.$_URL() + "/api/v2/user/edit",
								method:'PUT',
								header:this.$_Fresns_Header(),
								data:{
									"avatarUrl":JSON.parse(res.data).data.imageBigUrl
								},
								success: (res_) => {
									uni.hideLoading();
									if(res_.data.code == 0){
										uni.setStorage({
											key: 'LinShiChuCun',
											data:"",
											success: (res__) => {
												uni.navigateBack()
											}
										});
									}else{
										uni.showToast({
											title:res_.data.message,
											icon:"none",
											duration:1000
										});
									}
								}
							})
						}else{
							uni.hideLoading();
							uni.showToast({
								title:JSON.parse(res.data).message,
								icon:"none",
								duration:1000
							});
						}
					}
				})
			},
			DianJi_AnNiu_YongHuTiaoFu(){
				uni.chooseImage({
					count:1,
					success: (res_) => {
						this.DianJi_AnNiu_YongHuTiaoFu_FangFa(res_.tempFiles)
					}
				})
			},
			DianJi_AnNiu_YongHuTiaoFu_FangFa(e){
				const _this = this;
				uni.showLoading({ title: "上传中" });
				uni.uploadFile({
					url: _this.$_URL() + "/api/v2/common/upload-file",
					filePath: e[0].path,
					name: "file",
					header: _this.$_Fresns_Header(),
					formData:{
						"tableName":"users",
						"tableColumn":"banner_file_id",
						"tableKey":_this.GeRen_ZiLiao.username,
						"type":"image",
						"uploadMode":"file"
					},
					success(res) {
						if(JSON.parse(res.data).code == 0){
							uni.request({
								url:_this.$_URL() + "/api/v2/user/edit",
								method:'PUT',
								header:_this.$_Fresns_Header(),
								data:{
									"bannerUrl":JSON.parse(res.data).data.imageBigUrl
								},
								success: (res_) => {
									uni.hideLoading();
									if(res_.data.code == 0){
										_this.QingQiu_YongHuZiLiao()
									}else{
										uni.showToast({
											title:res_.data.message,
											icon:"none",
											duration:1000
										});
									}
								}
							})
						}else{
							uni.hideLoading();
							uni.showToast({
								title:JSON.parse(res.data).message,
								icon:"none",
								duration:1000
							});
						}
					}
				})
			},
		}
	}
</script>

<style lang="scss">
.ZiDingYi-DanHang-Input{
	display: flex;
	margin: 25rpx 25rpx 0 25rpx;
	border: 1rpx solid $BianKuangSe;
	height: 90rpx;
	border-radius: 10rpx;
	overflow: hidden;
	.Zuo{
		height: 90rpx;
		display: flex;
		align-items: center;
		background: $BeiJingSe;
		padding: 0 25rpx;
		border-right: 1rpx solid $BianKuangSe;
		line-height: 28rpx;
	}
	input{
		height: 90rpx;
		flex: 1;
		padding: 0 25rpx;
		font-size: 28rpx;
	}
	.You{
		flex-shrink: 0;
		height: 90rpx;
		.AnNiu{
			height: 90rpx;
			background: $LanSe;
			color: #FFF;
			display: flex;
			align-items: center;
			line-height: 90rpx;
			padding: 0 25rpx;
		}
	}
}
.ZiDingYi-DanHang-Input-ZhaiYao{
	font-size: 22rpx;
	color: $ZhanWeiSe;
	margin: 5rpx 25rpx 0 25rpx;
}
.TouXiang{
	width: 200rpx;
	height: 200rpx;
	overflow: hidden;
	position: relative;
	margin: 50rpx auto auto auto;
	border-radius: 100%;
	box-shadow: 0 0 1rpx $FuZhuSe;
	view{
		width: 200rpx;
		height: 200rpx;
		overflow: hidden;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 1;
		image{
			display: block;
			width: 100%;
			height: auto;
		}
	}
	.iconfont{
		display: flex;
		align-items: center;
		justify-content: center;
		width: 200rpx;
		height: 200rpx;
		position: absolute;
		top: 0;
		left: 0;
		z-index: 2;
		font-size: 50rpx;
	}
}
.YongHu-HengFu{
	width: 700rpx;
	height: 300rpx;
	overflow: hidden;
	display: flex;
	border-radius: 10rpx;
	align-items: center;
	justify-content: center;
	color: $ZhanWeiSe;
	margin: 25rpx 25rpx 0 25rpx;
	background: $BeiJingSe;
	image{
		display: block;
		width: 100%;
		height: auto;
	}
}
</style>
